<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>blocks</title>
    <link rel="stylesheet" href="index.css">
    <script type="module" src="main.js"></script>
    <meta property="og:url" content="https://blocks.gatunes.com" />
    <meta property="og:title" content="blocks" />
    <meta property="og:description" content="webxr multiplayer voxels engine" />
    <meta property="og:image" content="https://blocks.gatunes.com/auth/location/5efd37aaf8c03a265013d09b/photo" />
    <meta property="og:image:type" content="image/jpeg" />
    <meta property="og:image:width" content="1280" />
    <meta property="og:image:height" content="720" />
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:creator" content="@DaniGatunes" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
  </head>
  <body>
    <div id="renderer"></div>
    <div id="enterVR" style="display:none">
      Enter VR
    </div>
    <div id="info">
      server: <a id="server">···</a><br />
      chunk: <span id="chunk">···</span> | players: <span id="players">···</span><br /><br />
      blocks - <span id="fps">···</span><br />
      <span id="support">···</span><br />
      <a href="https://dani.gatunes.com" rel="noopener noreferrer" target="_blank">dani@gatunes</a> © 2020
    </div>
    <a
      id="destinations"
      href="https://blocks.gatunes.com/destinations"
      rel="noopener noreferrer"
    >
      <svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 250 250" fill="#bbb">
        <path d="M0 0v250L250 0z" fill="rgba(0,0,0,0.3)"/>
        <text transform="translate(110 110) rotate(-45)" text-anchor="middle">
          Destinations
        </text>
      </svg>
    </a>
    <a
      id="github"
      href="https://github.com/danielesteban/blocks"
      rel="noopener noreferrer"
      target="_blank"
    >
      <svg xmlns="http://www.w3.org/2000/svg" width="80" height="80" viewBox="0 0 250 250" fill="#bbb">
        <path d="M0 0l115 115h15l12 27 108 108V0z" fill="rgba(0,0,0,0.3)"/>
        <path class="octo-arm" d="M128 109c-15-9-9-19-9-19 3-7 2-11 2-11-1-7 3-2 3-2 4 5 2 11 2 11-3 10 5 15 9 16" />
        <path class="octo-body" d="M115 115s4 2 5 0l14-14c3-2 6-3 8-3-8-11-15-24 2-41 5-5 10-7 16-7 1-2 3-7 12-11 0 0 5 3 7 16 4 2 8 5 12 9s7 8 9 12c14 3 17 7 17 7-4 8-9 11-11 11 0 6-2 11-7 16-16 16-30 10-41 2 0 3-1 7-5 11l-12 11c-1 1 1 5 1 5z"/>
      </svg>
    </a>
    <div id="session" style="display:none">
      <div></div>
      <div>
        <button type="button"></button>
        <canvas></canvas>
      </div>
    </div>
    <div id="location" class="dialog">
      <div>
        <img />
        <div>
          <div></div>
          <div></div>
        </div>
      </div>
    </div>
    <div id="login" class="dialog">
      <form>
        <input placeholder="Email" name="email" type="email" required />
        <input placeholder="Password" name="password" type="password" required />
        <div class="error"></div>
        <button class="primary" name="submit" type="submit">Login</button>
        <div class="spacer"></div>
        <a>Create an account</a>
      </form>
    </div>
    <div id="register" class="dialog">
      <form>
        <input placeholder="Name" name="name" type="text" required />
        <input placeholder="Email" name="email" type="email" required />
        <input placeholder="Password" name="password" type="password" required />
        <input placeholder="Confirm Password" name="confirmPassword" type="password" required />
        <div class="error"></div>
        <button class="primary" name="submit" type="submit">Register</button>
        <div class="spacer"></div>
        <a>Already have an account?</a>
      </form>
    </div>
  </body>
</html>
